import React, { useState, useEffect } from 'react'
import { useNavigate } from "react-router-dom"
import "../Hcy_scss/Hcy_page4.scss"
import { useDispatch } from 'react-redux'
import { changeDefaultState } from "../../../redux/slice/DefaultSlice"
export default function Hcy_page4() {
  const navigate = useNavigate()
  const dispatch = useDispatch()
  const getCurrentDateTime = () => {
    const now = new Date();
    const year = now.getFullYear();
    const month = String(now.getMonth() + 1).padStart(2, '0');
    const day = String(now.getDate()).padStart(2, '0');
    const hours = String(now.getHours()).padStart(2, '0');
    const minutes = String(now.getMinutes()).padStart(2, '0');
    return `${year}年${month}月${day}日  ${hours}:${minutes}`;
  };

  return (
    <div id='Hcy_page4' className="animate__animated animate__bounceInUp">
      <h2>订单取消成功</h2>
      <p>订单已取消，您可以重新打车。</p>
      <p style={{color:"black",marginTop:"20px"}}>
        <span><svg t="1728529140582" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2627" width="16" height="16"><path d="M721.92 573.44h-197.4272V300.8512a34.6112 34.6112 0 1 0-68.8128 0v306.9952a36.4544 36.4544 0 0 0 34.4064 34.4064h231.8336a34.6112 34.6112 0 1 0 0-68.8128zM512 4.9152A507.0848 507.0848 0 1 0 1019.0848 512 507.0848 507.0848 0 0 0 512 4.9152z m0 939.2128A432.128 432.128 0 1 1 944.128 512 432.128 432.128 0 0 1 512 944.128z" fill="#707070" p-id="2628"></path></svg></span>
        {getCurrentDateTime()}</p>
      <p style={{color:"black"}}>起点：保定理工学院-科技东门</p>
      <p style={{color:"black"}}>终点：团结屯-狗熊岭-光头强小屋</p>
      <button onClick={()=>{dispatch(changeDefaultState(0))}}>重新打车</button>
    </div>
  )
}
